//  垂直居中对齐
.vertical-align-flex {
  display: flex;
  align-items: center;
	flex-wrap: wrap;
}
.both-center-row {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.both-center-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.flex-row{
	display: flex;
}
.flex-col{
	display: flex;
	flex-direction: column;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
}
.between {
	justify-content: space-between;
}
.flex-wrap{
	flex-wrap: wrap;
}
.flex-oneline {
	flex: 0 0 100%;
}
// 水平居中对齐
.horizontal-align-flex {
  display: flex;
  flex-direction: column;
  align-items: center;
}
//  水平居中对齐
.horizontal-align-margin{
  margin: 0 auto;
}
//  水平居中子元素
.text-center{
  text-align: center;
}
.vertical-align-middle{
  vertical-align: middle;
}
//  
.vertical-align-parent::before{
  content: "";
  display: inline-block;
	//  此属性有坑 相对于父级的height属性 min/max-width 无效
  height: 100%;
  vertical-align: middle;
}
.table-parent {
  display: table;
}
.table-child {
  display: table-cell;
  vertical-align: middle;
}
//  父级定位参考
.relative{
  position: relative;
}
.center-absolute{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /**
   * top , right, bottom, left: 0;
   * margin: auto;
   */
}
